<template>
  <div class="hello">
    <img src="../assets/logo.png">
    <h1>{{ msg }}</h1>
    <h3>阮一峰《ES6 入门》要点笔记</h3>
    <h4>auhtor：byts <span style="width: 10px;display: inline-block;"> </span> e-mail：594511164@qq.com</h4>
    <div class="divide-line"></div>
    <router-link to="/practice-field">点击进入</router-link>
  </div>
</template>

<script>
export default {
  name: 'HelloWorld',
  data () {
    return {
      msg: 'ES6 语法实践'
    }
  }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
img{
  width: 240px;
  border-radius: 10px;
  box-shadow: 0 0 5px #999;
  margin-top: 80px;
}
h1, h2 {
  font-weight: normal;
}
ul {
  list-style-type: none;
  padding: 0;
}
li {
  display: inline-block;
  margin: 0 10px;
}
a {
  color: #42b983;
  text-decoration: none;
}
.divide-line{
  border-top: 1px solid #333;
  width: 50%;
  margin: 0 auto;
  margin-bottom: 10px;
}
</style>
